<template>
  <div class="mod-config">
    <basic-container>
      <div class="boxsty zhiBiao">
        <el-tabs v-model="activeName" @tab-click="handleClick">
          <div class="flex justifyContentSpaceBetween">
            <!-- <div class="tabletext">{{fl}}算法管理</div> -->
          </div>
          <el-form
            :inline="true"
            :model="dataForm"
            @keyup.enter.native="getDataList1()"
            class="form-inline"
          >
            <el-form-item label="算法名称">
              <el-input v-model="dataForm.gsMc" placeholder="请输入算法名称"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button
                icon="el-icon-search"
                type="primary"
                class="marginLeft"
                @click="getDataList1(1)"
                :disabled="deptId===''"
              >检索</el-button>
            </el-form-item>
          </el-form>
          <div style="float: right;margin-top: -70px;">
            <!-- <el-link icon="el-icon-plus" v-if="permissions.jiangjin_jiangjingspzb_add" type="primary" -->
            <el-link
              icon="el-icon-plus"
              type="primary"
              @click="addOrUpdateHandle()"
              :underline="false"
            >新增算法信息</el-link>
          </div>
          <el-tab-pane
            :label="it.label"
            :name="'tab_' +index"
            v-for="(it,index) in tabs"
            :key="it.value"
          >
            <div class="avue-crud">
              <el-table
                :data="dataList"
                v-loading="dataListLoading"
                stripe
                tooltip-effect="light"
                class="avue-crud"
                height="470px"
              >
                <el-table-column label="序号" type="index" width="80"></el-table-column>
                <el-table-column prop="gsFl" label="算法分类" min-width="100"></el-table-column>
                <el-table-column prop="gsMc" label="算法名称" min-width="150"></el-table-column>
                <el-table-column prop="gsZs" label="算法展示" min-width="450"></el-table-column>
                <el-table-column prop="gsYz" label="算法验证" min-width="100">
                  <template slot-scope="scope">
                    <span v-if="scope.row.gsYz==1">验证已通过</span>
                    <span v-else>验证不通过</span>
                  </template>
                </el-table-column>
                <el-table-column label="操作" width="260">
                  <template slot-scope="scope">
                    <!-- <el-button v-if="permissions.jiangjin_jiangjingspzb_edit" type="primary" plain -->
                    <el-button type="primary" plain @click="configHandle(scope.row.id)">配置</el-button>
                    <!-- <el-button v-if="permissions.jiangjin_jiangjingspzb_edit" type="primary" plain -->
                    <el-button type="primary" plain @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
                    <!-- <el-button v-if="permissions.jiangjin_jiangjingspzb_del" type="danger" plain -->
                    <el-button type="danger" plain @click="deleteHandle(scope.row.id)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>

              <div class="avue-crud__pagination">
                <el-pagination
                  @size-change="sizeChangeHandle"
                  @current-change="currentChangeHandle"
                  :current-page="pageIndex"
                  :page-sizes="[10, 20, 50, 100]"
                  :page-size="pageSize"
                  :total="totalPage"
                  background
                  layout="total, sizes, prev, pager, next, jumper"
                ></el-pagination>
              </div>
            </div>
          </el-tab-pane>
        </el-tabs>
      </div>
      <!-- 弹窗, 新增 / 修改 -->
      <table-form v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList1"></table-form>
      <!-- 弹窗, 配置 -->
      <config-form ref="configForm" @refreshDataList="getDataList1"></config-form>
    </basic-container>
  </div>
</template>
<script>
import TableForm from "./sysformula-form";
import configForm from "./sysformula-form-config";
import { fetchList, delObj } from "@/api/admin/sysformula";
import { remote as remoteDict } from "@/api/admin/dict";
import { getJiangJinBm } from "@/api/admin/dept";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      dataList: [],
      pageIndex: 1,
      pageSize: 10,
      totalPage: 0,
      addOrUpdateVisible: false,
      dataListLoading: false,
      activeName: "tab_0",
      tabs: [
        { label: "奖金分配算法", value: "奖金算法" },
        { label: "合同任务算法", value: "合同算法" },
        { label: "精准激励算法", value: "考核算法" },
        { label: "考核汇总算法", value: "考核汇总" },
        { label: "工作任务书算法", value: "任务书算法" },
        { label: "统计分析算法", value: "统计分析算法"}, //by mingyue （只加一行）
      ],
      dataForm: {
        gsMc: "",
        gsType: ""
      },
      fl: "",
      deptId: 0, //负责部门ID
      deptName: "" //负责部门名称
    };
  },
  components: {
    TableForm,
    configForm
  },
  computed: {
    ...mapGetters(["permissions"])
  },
  mounted() {
    this.fl = this.tabs[0].value;
    this.getJiangJinJg();
  },
  methods: {
    getDataList1(page) {
      if (page) {
        this.pageIndex = page;
      }
      this.getDataList(this.deptId, this.fl);
    },
    // 新增 / 修改
    addOrUpdateHandle(id) {
      this.addOrUpdateVisible = true;
      this.$nextTick(() => {
        this.$refs.addOrUpdate.init(id, this.deptId, this.fl);
      });
    },
    handleClick(tab, event) {
      this.dataForm.gsMc = "",
      this.fl = this.tabs[tab.index].value;
      this.dataList = [];
      this.pageIndex = 1;
      this.getDataList(this.deptId, this.fl);
    },
    //获取奖金管理人机构
    getJiangJinJg() {
      this.getDataList(this.deptId, this.tabs[0].value);
      // getJiangJinBm().then(res => {
      //   if (res.data.data != null && res.data.data.length > 0) {
      //     this.deptId = "";
      //     this.deptName = "";
      //     this.deptId = res.data.data[0].deptId;
      //     this.deptName = res.data.data[0].name;
      //     this.getDataList(this.deptId, this.tabs[0].label)
      //   } else {
      //     this.$notify.closeAll();
      //     //this.$notify.error("没有相关负责部门")
      //     //this.deptName = "无相关负责部门";
      //   }
      // });
    },
    // 获取数据列表
    getDataList(deptId, type) {
      this.dataListLoading = true;
      this.$set(this.dataForm, "jjDeptId", deptId);
      this.dataForm.gsType = type;
      fetchList(
        Object.assign(
          {
            current: this.pageIndex,
            size: this.pageSize
          },
          this.dataForm
        )
      ).then(response => {
        this.dataList = response.data.data.records;
        this.totalPage = response.data.data.total;
      });
      this.dataListLoading = false;
    },
    // 每页数
    sizeChangeHandle(val) {
      this.pageSize = val;
      this.pageIndex = 1;
      this.getDataList(this.deptId, this.fl);
    },
    // 当前页
    currentChangeHandle(val) {
      this.pageIndex = val;
      this.getDataList(this.deptId, this.fl);
    },

    //配置
    configHandle(id) {
      this.$refs.configForm.init(id);
    },

    // 删除
    deleteHandle(id) {
      this.$confirm("是否确认删除ID为" + id, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(function() {
          return delObj(id);
        })
        .then(data => {
          this.$message.success("删除成功");
          this.getDataList(this.deptId, this.fl);
        });
    }
  }
};
</script>
